import React from "react";
import {Button, Row, Col, message, Form, Input} from "antd";
import auth from "../common/auth";
const createForm = Form.create;
const FormItem = Form.Item;
let Login = React.createClass({
    contextTypes: {
        router: React.PropTypes.object.isRequired
    },
    getInitialState() {
        return {
            loginTips: {
                v: false,
                msg: ""
            },
            codeurl: auth.getUrl() + '/identifycode?v=' + new Date().getTime()
        }
    },
    handleCode(){
        this.setState({
            codeurl: auth.getUrl() + '/identifycode?v=' + new Date().getTime()
        });
    },
    handleSubmit: function (e) {
        //e.preventDefault();
        this.props.form.validateFields((errors, values) => {
            if (!!errors) {
                ('Errors in form!!!');
                return;
            }
            let params = this.props.form.getFieldsValue();
            if (params.username == undefined || params.username == '') {
                let res = {msg: '用户名称不能为空！'}
                auth.msg(res);
                return;
            }
            //auth.setLocalStorage(auth.uuid());
            //this.context.router.push("/admin/home");
            //
            auth.fetch('/login',params,function(result){
              if(result.result=="0"){
            		//let token ={token:result.data.access_token }
            		auth.setLocalStorage(result.data.access_token);

            		this.context.router.push("/admin/home");
            	}else{
            		 message.error(result.message, 10);;
            		if(result.message.split(':')[0] == "PS0013"){
            			this.setState({
            				codeurl:auth.getUrl()+'/identifycode?v='+new Date().getTime()
            			});
            		}
                this.handleReset();
            	}
            }.bind(this));

        })
    },
    handleReset: function (e) {
        // e.preventDefault();
        this.props.form.resetFields();
        // this.setState({msg: msg});
    },
    keydownFn: function (event) {
        if (event.keyCode == '13') {
            this.handleSubmit();
        }
    },
    componentDidMount() {
        window.addEventListener('keydown', this.keydownFn);
    },

    render() {
        const {getFieldDecorator, getFieldError, isFieldValidating} = this.props.form;
        const formItemLayout = {
            labelCol: {span: 7},
            wrapperCol: {span: 12},
        };
        return (
            <Row type="flex" justify="space-around" align="middle" className="login_bg" style={{height: '100%'}}>
                <Col className="login">
                    <div>
                        <Form horizontal>
                            <FormItem  {...formItemLayout}  label="用户名：" hasFeedback>
                                 {getFieldDecorator('username', {
                                  rules: [{required: true, message: '请输入用户名称'},],
                              })
                              (
                                <Input  placeholder="请输入登录用户名称"/>
                              )}
                            </FormItem>

                            <FormItem
                                {...formItemLayout}
                                label="密码："
                                hasFeedback>
                                 {getFieldDecorator('password', {
                                  rules: [{required: true, message: '请输入密码'},],
                              })(
                                <Input type="password"  onContextMenu={false} onPaste={false} onCopy={false} onCut={false} placeholder="请输入密码"/>
                              )}
                            </FormItem>
                            <Row>
                                <Col span="13">
                                    <FormItem
                                        labelCol={{span: 13}}
                                        wrapperCol={{span: 11}}
                                        label="验证码："
                                        hasFeedback>
                                         {getFieldDecorator('identifycode', {
                                            rules: [{required: true, message: '请输入验证码'}],
                                          })(
                                            <Input  placeholder="请输入验证码"/>
                                          )}
                                    </FormItem>
                                </Col>
                                <Col span="9" style={{paddingLeft: 10}}>
                                    <img onClick={this.handleCode} src={this.state.codeurl} width={83} height={32}
                                          title="点击刷新验证码图片"/>
                                </Col>
                            </Row>


                            <FormItem wrapperCol={{span: 14, offset: 5}}>
                                <Button type="primary" style={{width: 240}} onClick={this.handleSubmit}>登录</Button>
                            </FormItem>
                        </Form>
                    </div>
                </Col>
            </Row>
        )
    }
})
Login = Form.create()(Login);
export default Login
